<html>
<head>
    <title>Random Cat Pictures</title>
    <link rel="stylesheet" href="06-gallery.css" type="text/css" />
    <script type="text/javascript" src="07-load.js"></script>
</head>
<body>
    <h1>Random Cat Pictures</h1>
    
    <p>Lorem ipsum dolor …</p>
    
    <!--
        Our Gallery, it must be a <ul> with a class of
        "gallery" - and should have a title associated with it.
    -->
    <ul class="gallery" title="Random Cat Pictures">

        <!--
            Each image of the gallery should be contained within an <li>
            and have a link pointing to the images actual location. If an image
            is tall, be sure to include the class "tall" with it too.
        -->

        <li><a href="gallery/image1.jpg"><img src="gallery/image1.jpg" alt="Fat Cat Sleeping"/></a></li>
        <li><a href="gallery/image2.jpg"><img src="gallery/image2.jpg" alt="Sharing the Bed"/></a></li>
        <li class="tall"><a href="gallery/image3.jpg"><img src="gallery/image3.jpg" alt="Out the Window"/></a></li>
        <li class="tall"><a href="gallery/image4.jpg"><img src="gallery/image4.jpg" alt="In the Sun"/></a></li>
        <li><a href="gallery/image5.jpg"><img src="gallery/image5.jpg" alt="Very Comfortable"/></a></li>

    </ul>
    
    <p>Lorem ipsum dolor …</p>
</body>
</html>

